<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>选择器的权重</title>
		<!-- 选择器的权重越高  选中几率越大 -->
		<style>
			*{   /* 权值:0  很容易被覆盖  */
				color: antiquewhite !important;  
				background: #ffaa7f;  /*!important ：不受权控制 */
			}
			div{  /* 权值: 1 */
			     color: aquamarine;
				 background: #ff0000;
			}
			.d1{ /* 权值: 10*/
				color: bisque;
				background: #55aaff;
			}
			div.d1{  /* 选择器权值之和 权值1+10  11 */
				color: #55ffff;
				background: #3e1136;
			}
			body div.d1{  /* 权值 12 */ 
				font-size: 25px;
				color: #ff0000;
				background: #aaaaff;
				
			}
			#d1{  /* 权值: 100  */
				font-size: 15x;
				color: #419977;
				background: #55aaff;
			}
			div#d1{  /* 权值: 101  */
				font-size: 20x;
				color: #419977;
				background: #55aaff;
			}
			div#d1:hover{  /* 权值: 111 */
			   color: #55ffff;
			   background: #aaaaff;
			}
		</style>
	</head>
	<body>
		<div class="d1" id="d1" style="color: #ff0000;">Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae omnis alias corrupti vel ducimus nihil temporibus sapiente suscipit hic at consequuntur quos enim, dolorum natus qui quidem dignissimos quisquam culpa.</div>
	</body>
</html>